{template 'common/header-gw'}
<style>
    .account-rank img{width:20px; height:20px;}
    .popover-content h5{padding-bottom: 5px}
</style>
<style>
    .template .item{position:relative;display:block;float:left;border:1px #ddd solid;border-radius:5px;background-color:#fff;padding:5px;width:190px;margin:0 20px 20px 0; overflow:hidden;}
    .template .title{margin:5px auto;line-height:2em;}
    .template .title a{text-decoration:none;}
    .template .item img{width:178px;height:270px; cursor:pointer;}
    .template .active.item-style img, .template .item-style:hover img{width:178px;height:270px;border:3px #009cd6 solid;padding:1px; }
    .template .title .fa{display:none}
    .template .active .fa.fa-check{display:inline-block;position:absolute;bottom:33px;right:6px;color:#FFF;background:#009CD6;padding:5px;font-size:14px;border-radius:0 0 6px 0;}
    .template .fa.fa-times{cursor:pointer;display:inline-block;position:absolute;top:10px;right:6px;color:#D9534F;background:#ffffff;padding:5px;font-size:14px;text-decoration:none;}
    .template .fa.fa-times:hover{color:red;}
    .template .item-bg{width:100%; height:342px; background:#000; position:absolute; z-index:1; opacity:0.5; margin:-5px 0 0 -5px;}
    .template .item-build-div1{position:absolute; z-index:2; margin:-5px 10px 0 5px; width:168px;}
    .template .item-build-div2{text-align:center; line-height:30px; padding-top:150px;}
    /*@media screen and (min-width:992px){#ListStyle{width:890px; margin:100px auto;}}*/
</style>

<form class="form-horizontal form" action="" method="post">
    <div class="clearfix">
        <div class="panel panel-default">
            <div class="panel-heading">
                站点信息
            </div>
            <div class="panel-body">
                <div class="form-group">
                    <label class="col-xs-12 col-sm-3 col-md-2 control-label">微站名称</label>
                    <div class="col-sm-9 col-xs-12">
                        <input type="text" name="title" class="form-control" value="{$multi['title']}" />
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-sm-3 col-md-2 control-label">是否启用</label>
                    <div class="col-sm-9 col-xs-12">
                        <label class="radio-inline"><input type="radio" name="status" value="1" {if $multi['status'] == '' || $multi['status'] == 1}checked{/if}>是</label>
                        <label class="radio-inline"><input type="radio" name="status" value="0" {if $multi['status'] === 0}checked{/if}>否</label>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-12 col-sm-4 col-md-3 col-lg-2 control-label">选择微站风格</label>
                    <div class="col-sm-8 col-xs-12">
                        <button type="button" class="btn btn-success" data-toggle="modal" data-target="#ListStyle">选择风格</button>
                        <input type="hidden" name="styleid" id="styleid" value="{$multi['styleid']}" />
                    </div>
                </div>
                <div class="form-group" id="preview-style" {if empty($multi['style']['tname'])}style="display:none;"{/if}>
                <label class="col-xs-12 col-sm-4 col-md-3 col-lg-2 control-label">当前微站风格</label>
                <div class="col-sm-8 col-xs-12">
                    <div class="template">
                        <div class="item item-style">
                            <div class="title">
                                <div style="overflow:hidden; height:28px;" id="current-title">{$multi['style']['name']}</div>
                                <a href="javascript:;">
                                    <img src="{$_W['siteroot']}app/themes/{$multi['style']['tname']}/preview.jpg" id="current-preview" class="img-rounded">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 风格列表 -->
            <div class="modal fade bs-example-modal-lg" id="ListStyle" aria-hidden="false" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                            <h4 class="modal-title">微站模板风格列表</h4>
                        </div>
                        <div class="modal-body template clearfix">
                            {loop $styles $style}
                            <div class="item item-style {if $multi['styleid'] == $style['id']} active {/if}">
                                <div class="title">
                                    <div class="title-{$style['id']}" style="overflow:hidden; height:28px;">{$style['name']}</div>
                                    <a href="javascript:;" class="change-style" data-styleid="{$style['id']}">
                                        <img src="{$_W['siteroot']}app/themes/{$style['tname']}/preview.jpg" class="img-rounded preview-{$style['id']}">
                                    </a>
                                    <span class="fa fa-check"></span>
                                </div>
                                <div class="btn-group  btn-group-justified">
                                    <a href="javascript:;" class="btn btn-default btn-xs change-style" data-styleid="{$style['id']}">选择风格</a>
                                </div>
                            </div>
                            {/loop}
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label">触发关键字</label>
                <div class="col-sm-9 col-xs-12">
                    <input type="text" name="keyword" class="form-control" value="{$multi['site_info']['keyword']}" />
                    <div class="help-block">用户触发关键字，系统回复此页面的图文链接</div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label">封面</label>
                <div class="col-sm-9 col-xs-12">
                    {php echo tpl_form_field_image('thumb', $multi['site_info']['thumb'])}
                    <div class="help-block">用于用户触发关键字后，系统回复时的封面图片</div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label">页面描述</label>
                <div class="col-sm-9 col-xs-12">
                    <input type="text" name="description" class="form-control" value="{$multi['site_info']['description']}" />
                    <div class="help-block">用户通过微信分享给朋友时,会自动显示页面描述</div>
                </div>
            </div>
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label">绑定域名</label>
                <div class="col-sm-9 col-xs-12">
                    <input type="text" name="bindhost" class="form-control" value="{$multi['bindhost']}" />
                    <span class="help-block">绑定时请先将域名解析指向到本服务器，请只填写host部分，例如：www.baidu.com</span>
                </div>
            </div>
            <div class="form-group">
                <label class="col-xs-12 col-sm-3 col-md-2 control-label">底部自定义</label>
                <div class="col-sm-9 col-xs-12">
                    <textarea style="height:150px;" class="form-control" cols="70" name="footer" autocomplete="off">{$multi['site_info']['footer']}</textarea>
                    <span class="help-block">自定义底部信息，支持HTML</span>
                </div>
            </div>
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-12">
            <input name="submit" type="submit" value="提交" class="btn btn-primary col-lg-1" />
            <input type="hidden" name="token" value="{$_W['token']}" />
        </div>
    </div>
    </div>
</form>

<script type="text/javascript">
    $('.change-style').click(function() {
        var styleId = parseInt($(this).data('styleid'));
        var title = $('.title-' + styleId).text();
        var preview = $('.preview-' + styleId).attr('src');
        $('.item-style').removeClass('active');
        $('#styleid').val(styleId);
        $('#current-title').text(title);
        $('#current-preview').attr('src', preview);
        $(this).parent().parent().addClass('active');
        $('#preview-style').show();
        $('#ListStyle').modal('hide');
    });
</script>